
<script lang="ts" setup>
import headerUtil from "./base/common/headerUtil.vue";
import { ref, reactive, nextTick } from 'vue';
import { useRouter } from 'vue-router';
const router = useRouter();
import { showToast} from "vant";
import reqApis from '../req/reqApis.js';


const currentData = ref<any>({
  headerObj:{
    showType: 2,
    closeBtn: false
  },
  from: {
    type: router.currentRoute.value.query.type,
    month0: "",
    month1: "",
    startTime: "",
    endTime: "",
    userName: "",
    carModel: "",
    carNo: "",
    productType: "",
    cardNo: "",
    shopName: "",
    totalNum: "",
  }

});

const createPDF = () => {
  // if(currentData.value.from.month0 == "") return showToast("产品质量质保期限（月）不能为空");
  // if(currentData.value.from.month1 == "") return showToast("人为质保车衣险期限（月）不能为空");
  // if(currentData.value.from.startTime == "") return showToast("生效开始时间不能为空");
  // if(currentData.value.from.endTime == "") return showToast("截止时间不能为空");
  // if(currentData.value.from.userName == "") return showToast("车主姓名不能为空");
  // if(currentData.value.from.carModel == "") return showToast("车架号不能为空");
  // if(currentData.value.from.carNo == "") return showToast("车牌号不能为空");
  // if(currentData.value.from.productType == "") return showToast("产品系列不能为空");
  // if(currentData.value.from.cardNo == "") return showToast("质保卡号不能为空");
  // if(currentData.value.from.shopName == "") return showToast("服务门店不能为空");
  // if(currentData.value.from.totalNum == "") return showToast("合计不能为空");

  
  reqApis.createPDFApi(currentData.value.from).then((res:any) => {

       console.log(res)
            // const fileName = res.headers["content-disposition"].split("=")[1];
            console.log(88, res.headers);
            // const fileName = res.headers["content-disposition"].split("=")[1];

            const _res = res.data;
            let blob = new Blob([_res], {type: 'application/pdf'});
            let downloadElement = document.createElement("a");
            let href = window.URL.createObjectURL(blob); //创建下载的链接
            downloadElement.href = href;
            // downloadElement.download = fileName; //下载后文件名
            downloadElement.download = "work11"; //下载后文件名
            document.body.appendChild(downloadElement);
            downloadElement.click(); //点击下载
            document.body.removeChild(downloadElement); //下载完成移除元素
            window.URL.revokeObjectURL(href); //释放掉blob对象
  })


}


</script>
<template>
  <div class="demo">
    <div class="header">
      <headerUtil :obj="currentData.headerObj">编辑/保存</headerUtil>
    </div>
    <div class="content">
      <van-cell-group>
        <van-field v-model.trim="currentData.from.month0" label="产品质量质保期限（月）" placeholder="请输入月数" />
        <van-field v-model.trim="currentData.from.month1" label="人为质保车衣险期限（月）" placeholder="请输入月数" />
        <van-field v-model.trim="currentData.from.startTime" label="生效开始时间" placeholder="请输入开始日期" />
        <van-field v-model.trim="currentData.from.endTime" label="截止时间" placeholder="请输入结束日期" />
        <van-field v-model.trim="currentData.from.userName" label="车主姓名" placeholder="请输入" />
        <van-field v-model.trim="currentData.from.carModel" label="车架号" placeholder="请输入" />
        <van-field v-model.trim="currentData.from.carNo" label="车牌号" placeholder="请输入" />
        <van-field v-model.trim="currentData.from.productType" label="产品系列" placeholder="请输入" />
        <van-field v-model.trim="currentData.from.cardNo" label="质保卡号" placeholder="请输入" />
        <van-field v-model.trim="currentData.from.shopName" label="服务门店" placeholder="请输入" />
        <van-field v-model.trim="currentData.from.totalNum" label="合计" placeholder="请输入" />
      </van-cell-group>
      <div class="btnWrap">
        <van-button type="primary" @click="createPDF()">点击生成pdf</van-button>
      </div>
    </div>
    
    
  </div>
</template>

<style lang="less" scoped>
.demo {
  position: relative;
  width: 3.75rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  .header {
    width: 3.75rem;
    height: .44rem;
    // position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
  }
  .content {
    padding: .1rem;
    width: 3.75rem;
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    position: relative;
    overflow-x: hidden;
    img {
      width: 100%;
    }
  }
  .btnWrap {
    padding-top: .3rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }

}
</style>
 